<template>
  <div class="backgroundColor1 container fixed myWithdrawMoney">
    <Header content="充币"></Header>
    <div class="myChangeContain">
      <group class="login" style="margin-top: 15px;">
        <x-input v-model="userName" placeholder="用户名" class="font15" style="margin-bottom: 0"></x-input>
      </group>
      <group class="login" style="margin-top: 15px;">
        <x-input v-model="amount" placeholder="转出金额" class="font15" style="margin-bottom: 0"  @on-change="changeMount">
        </x-input>
      </group>
      <group class="login" style="margin-top: 15px;">
        <x-input v-model="loginPwd" placeholder="请输入登录密码" type="password" class="font15" style="margin-bottom: 0"></x-input>
      </group>
      <group class="login" style="margin-top: 15px;">
        <x-input v-model="pwd" placeholder="输入交易密码" type="password" class="font15" style="margin-bottom: 0"></x-input>
      </group>
      <div class="login" style="margin-top: 15px;">
        <x-button type="primary" @click.native="submit">转出</x-button>
      </div>
      <Captcha
        :showToast="showToast"
        @close="close"
        @setInter="setInter"
      ></Captcha>
    </div>
  </div>
</template>
<script>
  import Header from '../common/header.vue'
  import {XInput,Group,XTextarea } from 'vux'
  import Captcha from '../common/captcha.vue'
  export default{
    data(){
      return {
        amount:'',
        address:'',
        currencyInfo:'',
        pwd:'',
        code:'',
        smsId:'',
        codeContent:'发送验证码',
        codeDisabled:false,
        showToast:false,
        userName:'',
        loginPwd:''
      }
    },
    methods:{
      changeMount(value){
        if(value > this.totalMoney){
          this.$nextTick(()=>{
            this.amount = this.totalMoney;
          })
        }else{
          var arr = String(value).split('.');
          if(arr[1]){
            var value1 = arr[0] + '.' + arr[1].substring(0,4);
            this.$nextTick(()=>{
              this.amount = value1;
            })
          }
        }
      },
      openDialog(){
        if(this.codeDisabled){
          return;
        }
        this.showToast = true;
      },
      close(){
        this.showToast = false;
      },
      setInter(smsCode){
        this.smsId = smsCode;
        var count = 60;
        this.codeContent = count + 's';
        this.codeDisabled = true;
        this.timer = setInterval(()=>{
          count--;
          this.codeContent = count + 's';
          if(count<=0){
            clearInterval(this.timer);
            this.codeDisabled = false;
            this.codeContent = '发送验证码';
          }
        },1000)
      },
      goTo(path){
        this.$router.push(path);
      },
      exports(){
        this.service('exports',{
          currency_id:this.currencyInfo.currency_id,
          address:this.address,
          amount:this.amount,
          asset_password:this.pwd,
          smsCode:this.code,
          smsId:this.smsId,
        },'post').then(res=>{
          if(res.code == 200){
            this.toastFn('提币成功','','success');
            this.goTo('/myself')
          }else{
            this.toastFn(res.msg);
          }
        })
      },
      submit(){
        if(!this.address){
          this.toastFn('请填写提币地址');
          return
        }else if(this.amount== 0){
          this.toastFn('请输入提币金额');
          return
        }else if(!this.pwd){
          this.toastFn('请输入提币密码');
          return
        }else if(!this.code){
          this.toastFn('请输入验证码');
          return
        }
        this.exports();
      },
      allAmount(){
        this.amount = this.totalMoney;
      }
    },
    created(){
      this.totalMoney = JSON.parse(sessionStorage.getItem('accountsList')).amount;
      this.userName = JSON.parse(localStorage.getItem('userInfo')).nickname;
      if(JSON.parse(sessionStorage.getItem('currencyList'))){
        this.currencyInfo = JSON.parse(sessionStorage.getItem('currencyList'));
      }else{
        this.$store.dispatch('currency').then(res=>{
          this.currencyInfo = JSON.parse(sessionStorage.getItem('currencyList'));
        });
      }
    },
    components:{
      Header,
      XInput,
      Group,
      XTextarea,
      Captcha
    }
  }
</script>
<style>
  .myChangeContain{
    margin:26px 20px;
    background: #FFFFFF;
    padding:26px 25px;
    box-shadow: 0 1px 4px 0 rgba(240,240,240,0.50);
    border-radius: 10px;
  }
  .underline{
    border-bottom: 1px solid #F5F5F5;
    margin:20px 0;
  }
  .weui-textarea{
    background:#FAFAFA;
  }
</style>

